<!DOCTYPE html>
<html>
<head>
    <title><%=title%></title>
    <% include common/top.html %>
    <link rel='stylesheet' href='/pc/js/libs/bootstrap-sweetalert/sweetalert.css'/>
    <link rel='stylesheet' href='/pc/css/myShop.css'/>
    <script src='/pc/js/myShop.js'></script>
</head>
<body>
<!--大部分页面基于前端渲染，对于少数使用后端渲染页面的时候，配置partials，同时在这边引入content部分-->
    <% include common/header.html %>
    <div class="content container"  v-cloak>
        <div class="panel panel-info">
            <div class="panel-heading">店铺信息</div>
            <div class="panel-body">
                <div class="row">
                    <label class="col-sm-2">店铺名称</label>
                    <div class="col-sm-10">
                        {{shop.shop_name}}
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-2">店铺描述</label>
                    <div class="col-sm-10">
                        {{shop.shop_desc}}
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-2">联系电话</label>
                    <div class="col-sm-10">
                        {{shop.phone}}
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-2">店铺地址</label>
                    <div class="col-sm-10">
                        {{shop.address}}
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-2">起送金额</label>
                    <div class="col-sm-10">
                        {{shop.least_price_send}}元
                    </div>
                </div>
            </div>
        </div>
        <div class="panel panel-info">
            <div class="panel-heading">菜单</div>
            <div class="panel-body">
                <table class="table table-hover" v-if="shop.dishes.length">
                    <thead>
                        <tr>
                            <td>名称</td>
                            <td>描述</td>
                            <td>价格</td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr  v-for="dish in shop.dishes">
                            <td>{{dish.name}}</td>
                            <td>{{dish.desc}}</td>
                            <td>{{dish.price|currency}}元</td>
                        </tr>
                    </tbody>
                </table>
                <div class="op_group">
                    <button class="btn btn-default" data-toggle="modal" data-target="#myModal">新增</button>
                </div>
            </div>
        </div>
        <div class="panel panel-info">
            <div class="panel-heading">订单管理</div>
            <div class="panel-body">
                <table class="table table-hover table-bordered">
                    <thead>
                        <tr>
                            <td>订单号</td>
                            <td>菜品</td>
                            <td>买家联系方式</td>
                            <td>卖家联系方式</td>
                            <td>配送地址</td>
                            <td>总价</td>
                            <td>操作</td>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in order">
                            <td>{{item._id}}</td>
                            <td>
                                <template v-for="dish in item.dish">
                                    {{dish.name}}/{{dish.price}}*{{dish.num}}<br/>
                                </template>

                            </td>
                            <td>{{item.buyerPhone}}</td>
                            <td>{{item.sellerPhone}}</td>
                            <td>{{item.buyerAddress}}</td>
                            <td>{{item.totalPrice}}</td>
                            <td><button class="btn btn-success" @click="completeOrder(item._id)">完成订单</button></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="panel panel-info">
            <div class="panel-heading">最新评论</div>
            <div class="panel-body">
                <ul>
                    <li v-for="comment in comments">
                        <div class="comment_content">{{comment.content}}</div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" v-cloak>
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">Modal title</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <validator name="validation1">
                            <div class="form-group">
                                <label for="dish_name" class="col-sm-2 control-label">商品名称</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" placeholder="商品名称" id="dish_name" name="dish_name" field="dish_name" v-validate="rule.dish_name">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="dish_desc" class="col-sm-2 control-label">商品描述</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" placeholder="商品描述" id="dish_desc" name="dish_desc" field="dish_desc" v-validate="rule.dish_desc">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="dish_price" class="col-sm-2 control-label">价格</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" placeholder="价格" id="dish_price" name="dish_price" field="dish_price" v-validate="rule.dish_price" v-model="dish_price|currency">
                                </div>
                            </div>
                        </validator>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" @click="submit">Save changes</button>
                </div>
            </div>
        </div>
    </div>
</body>
</html>